@scripts = {
  <script type="text/javascript" src="@routes.Assets.versioned("javascripts/search.js")"></script>
}

@main("search page", scripts) {
    <style>
        body{
            text-align: center;
        }
        .search{
            margin:10px auto;
        }
        input{
            margin:5px 0;
        }
        .bill, .category{
            width:50px;
        }
    </style>
    <div class="generalSearch search">
        <h2>general search</h2>
        <input type="text" class="genralSearchInput"/>
        <select id="opt">
            <option value="users">user</option>
            <option value="products">product</option>
            <option value="customers">customer</option>
            <option value="bills">bill</option>
            <option value="billItems">billItem</option>
            <option value="categorys">category</option>
        </select>
    </div>

    <hr/>

    <div class="searchBill search">
        <h2>bill search</h2>
        <input type="date" class="start"/>
        <input type="text" class="customer"/>
        <input type="date" class="end"/>
    </div>

    <hr/>

    <div class="searchSell search">
        <h2>sell search</h2>
        <input type="date" class="start"/>
        <input type="text" class="category"/>
        <input type="date" class="end"/>
    </div>

    <hr/>

    <div class="searchPanel">
        <h2>result</h2>
        <ul class="records">

        </ul>
    </div>
}